<template>
    <div class="tab-pane fade show active" id="accout-detail" role="tabpanel">
        <div class="light-shadow-bg post-ad-box-layout1 myaccount-store-settings myaccount-detail">
            <div class="light-box-content">
                <form action="#">
                    <div class="post-section basic-information">
                        <div class="post-ad-title">
                            <i class="fas fa-user"></i>
                            <h3 class="item-title">Basic Information</h3>
                        </div>
                        <div class="row">
                            <div class="col-sm-3">
                                <label class="control-label">
                                    Username
                                </label>
                            </div>
                            <div class="col-sm-9">
                                <div class="form-group">
                                    <div class="text-value">demo</div>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-3">
                                <label class="control-label">
                                    First Name
                                </label>
                            </div>
                            <div class="col-sm-9">
                                <div class="form-group">
                                    <input type="text" value="Saymon" class="form-control"
                                           name="first-name" id="first-name">
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-3">
                                <label class="control-label">
                                    Last Name
                                </label>
                            </div>
                            <div class="col-sm-9">
                                <div class="form-group">
                                    <input type="text" value="Mondol" class="form-control"
                                           name="last-name" id="last-name">
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-3">
                                <label class="control-label">
                                    Email
                                    <span>*</span>
                                </label>
                            </div>
                            <div class="col-sm-9">
                                <div class="form-group">
                                    <input type="email" value="techlabpro.8@gmail.com"
                                           class="form-control" name="email" id="email">
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-3">
                                <label class="control-label">
                                    Change Password
                                </label>
                            </div>
                            <div class="col-sm-9">
                                <div class="form-group mb-5">
                                    <div class="form-check form-check-box">
                                        <input class="form-check-input" type="checkbox"
                                               id="password" value="password">
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-3">
                                <label class="control-label">
                                    Phone
                                </label>
                            </div>
                            <div class="col-sm-9">
                                <div class="form-group">
                                    <input type="text" value="09988434436"
                                           class="form-control" name="phone1" id="phone1">
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-3">
                                <label class="control-label">
                                    WhatsApp Phone
                                </label>
                            </div>
                            <div class="col-sm-9">
                                <div class="form-group">
                                    <input type="text" value="0812345678900"
                                           class="form-control" name="phone2" id="phone2">
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-3">
                                <label class="control-label">
                                    Website
                                </label>
                            </div>
                            <div class="col-sm-9">
                                <div class="form-group">
                                    <input type="text" value="https://www.radiustheme.com"
                                           class="form-control" name="website" id="website">
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="post-section location-detail">
                        <div class="post-ad-title">
                            <i class="fas fa-map-marker-alt"></i>
                            <h3 class="item-title">Location</h3>
                        </div>
                        <div class="row">
                            <div class="col-sm-3">
                                <label class="control-label">
                                    State
                                    <span>*</span>
                                </label>
                            </div>
                            <div class="col-sm-9">
                                <div class="form-group">
                                    <select class="form-control select-box">
                                        <option value="0">Select State</option>
                                        <option value="1">California</option>
                                        <option value="2">Florida</option>
                                        <option value="3">Hawaii</option>
                                        <option value="4">Indiana</option>
                                        <option value="5">Kansas</option>
                                        <option value="6">Michigan</option>
                                        <option value="7">New Jersey</option>
                                        <option value="8">New Mexico</option>
                                        <option value="9">New York</option>
                                        <option value="10">Pennsylvania</option>
                                        <option value="11">Texas</option>
                                        <option value="12">Washington</option>
                                        <option value="13">Wyoming</option>
                                    </select>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-3">
                                <label class="control-label">
                                    City
                                    <span>*</span>
                                </label>
                            </div>
                            <div class="col-sm-9">
                                <div class="form-group">
                                    <select class="form-control select-box">
                                        <option value="0">Select City</option>
                                        <option value="1">Los Angeles</option>
                                        <option value="2">LAX/LA Beaches</option>
                                        <option value="3">San Diego</option>
                                        <option value="4">San Jose</option>
                                        <option value="5">San Francisco</option>
                                        <option value="6">Fresno</option>
                                        <option value="7">Sacramento</option>
                                        <option value="8">Oakland</option>
                                        <option value="9">Bakersfield</option>
                                        <option value="10">Riverside</option>
                                        <option value="11">Eureka</option>
                                        <option value="12">Death Valley</option>
                                        <option value="12">Mammoth Lakes</option>
                                    </select>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-3">
                                <label class="control-label">
                                    Zip Code
                                </label>
                            </div>
                            <div class="col-sm-9">
                                <div class="form-group">
                                    <input type="text" value="201301" class="form-control"
                                           name="zipcode" id="post-zip">
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-3">
                                <label class="control-label">
                                    Address
                                </label>
                            </div>
                            <div class="col-sm-9">
                                <div class="form-group">
                                                                <textarea name="address1" class="form-control textarea"
                                                                          id="address1" cols="30"
                                                                          rows="2">Melbourne</textarea>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-3">
                                <label class="control-label">
                                    Map
                                </label>
                            </div>
                            <div class="col-sm-9">
                                <div class="form-group">
                                    <div id="googleMap" class="google-map"
                                         style="width: 100%; height: 400px;"></div>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-3">

                            </div>
                            <div class="col-sm-9">
                                <div class="form-group">
                                    <input type="submit" class="submit-btn"
                                           value="Update Account">
                                </div>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</template>
<script>
    export default {
        name: 'account'
    }
</script>